<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>在线点餐系统管理平台</title>
<link rel="stylesheet" href="${pageContext.request.contextPath }/admin/css/foodlist.css" type="text/css" media="screen" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/admin/css/reset.css" type="text/css" media="screen" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/admin/css/style.css" type="text/css" media="screen" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/admin/css/invalid.css" type="text/css" media="screen" />
<link rel="stylesheet" href="${pageContext.request.contextPath }/admin/css/jquery_dialog.css" type="text/css" media="screen" />
<script type="text/javascript" src="${pageContext.request.contextPath }/admin/scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/admin/scripts/simpla.jquery.configuration.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/admin/scripts/facebox.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/admin/scripts/jquery.wysiwyg.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/admin/scripts/jquery.datePicker.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/admin/scripts/jquery.date.js"></script> 
<script type="text/javascript" src="${pageContext.request.contextPath }/admin/scripts/jquery_dialog.js"></script> 
<script type="text/javascript">

	function goPage(toPage){
		var frm = document.getElementById("frmPage");
		frm["pageObj.currPage"].value=toPage;
		frm.submit();
	}
	function delOneFood(obj,toPage,foodId){
	  if(!confirm("您确定要删除此商品？")){
	     return;
	  }
	 obj.href="foodManager!del?pageObj.currPage="+toPage+"&foodIds="+foodId;	 
	}
	
	function delMoreFood(obj,toPage){
		if(!confirm("您确定要删除商品？")){
		     return;
		}	  
	   var foodIds_list=$("input[name='foodId']:checked");
	   if(foodIds_list.length==0){
	   	 return;
	   }
	   var foodIds="";
	   for(var i=0;i<foodIds_list.length;i++){
	  	 foodIds+=(i<foodIds_list.length-1)?foodIds_list[i].value+",":foodIds_list[i].value;
	   }
	  obj.href="foodManager!del?pageObj.currPage="+toPage+"&foodIds="+foodIds;	 
	};
	//显示修改商品div
	function showUpdate(Id,name,price,type,state,description,pic,foodClass,favPrice){
		var url="foodManager!getAllFoodType";
		$.post(url,function(data){
			var allFoodType=eval(data);
			var select="";
			for(var i=0;i<allFoodType.length;i++){
				var foodtype=eval(allFoodType[i]);
				select+="<option value='"+foodtype[0]+"'>"+foodtype[1]+"</option>";
			}
			var content="<form action='foodManager!updateFood' encType='multipart/form-data' namespace='/admin'   method='post'><table class='updateTable'>";
			content+="<tr><td colspan='2'><div id='showimg'>阿发</div></td></tr>";
			content+="<tr><td width='50%'>商品名称：<input name='food.name' onkeyup='ckfoodName(this.value)' value="+name+" /><span id='ckfoodname'></span></td><td>商品单价：<input name='food.price' value="+price+" /></td></tr>";
			content+="<tr><td>商品类别：<select class='selectc' name='food.foodType.id'></select></td><td>商品状态：<input type='radio' value='1' name='food.state' />正常  &nbsp; &nbsp; <input type='radio' value='2' name='food.state' />下架</td></tr>";
			content+="<tr><td colspan='2'>是否推荐/优惠：<input name='food.foodClass' type='radio' onclick=$('#yh').hide();$('input[name=food.favPrice]').val('')  value='1' checked='checked'/>一&nbsp;&nbsp;般&nbsp;&nbsp;<input  type='radio' onclick=$('#yh').hide();$('input[name=food.favPrice]').val('') name='food.foodClass' value='2'/>推&nbsp;&nbsp;荐&nbsp;&nbsp; <input type='radio' onclick=$('#yh').show(500) name='food.foodClass' value='3' />优&nbsp;&nbsp;惠";
			content+="<span style='heigth:20px;display:none' id='yh'><input type='text' name='food.favPrice' style='border-radius: 4px 4px 4px 4px;border:1px solid  rgb(213, 213, 213);;padding:4px;' value='' /><small> 必填,只能是整数或小数,如:10.5</small></span></td></tr>";
			content+="<tr><td colspan='2' >商品描述：<input size='78' name='food.description' value='"+description+"'/></td></tr>";
			content+="<tr><td colspan='2'>上传图片：<input size='15' name='foodPic'  type='file'/></td></tr>";
			content+="<tr><td colspan='2'><hr><input type='hidden' name='foodIds' value='"+Id+"'/><input type='submit' id='btnsubmit' class='button' value=' 提 交 '/></td></tr>";
			content+="</table>";
			content+="<input type='hidden' value='"+pic+"' name ='foodPicFileName'/>";
			content+="<input type='hidden' value='"+name+"' id ='foodName'/>";
			content+="</form>";
		
			new Dialog(content,{
							"width":"650px",
							"title":'商品修改',
							'modal':true,
							"closeModal":false
						});
				$("input[name='food.state'][value="+state+"]").attr("checked",'checked');
				$("select[name='food.foodType.id']").html(select);
				$("select[name='food.foodType.id']").val(type);
				$("#showimg").html("<img src=${pageContext.request.contextPath }/images/food/"+pic+" />");
				if(foodClass=='1'||foodClass=='2'){
					$("input[name='food.foodClass'][value='"+foodClass+"']").attr("checked","checked");
				}
				else{
					$("input[name='food.foodClass'][value='"+foodClass+"']").attr("checked","checked").click();
					$("input[name='food.favPrice']").val(favPrice);
				}
		});
	}
    //验证商品名字是否存在
    function ckfoodName(foodname){
    	if(foodname==$("#foodName").val()){
    		return;
    	}
    	var url="foodManager!chkFoodName";
    	$.post(url,{"food.name":foodname},function(data){
    		if(data=="true"){
    			$("#btnsubmit").attr("disabled","true");
    			$("#btnsubmit").removeAttr("class");
    			$("#ckfoodname").html("<font color='red'>该名称已存在！</font>");
    		}else{
    			$("#btnsubmit").removeAttr("disabled");
    			$("#btnsubmit").attr("class","button");
    			$("#ckfoodname").html("<font color='green'>ok！</font>");
    		}
    	});
    	
    }
	 //显示详情
	function shouDetial(name,price,type,state,description,pic,favPrice,foodclass){
		var _state=(state=='1')?"正常":(state=='2')?"下架":"异常";
		var _foodclass=(foodclass=='1')?"无":(foodclass=='2')?"推荐":"优惠";
		var content="<table class='fooddetial'>";
		content+="<tr><td width='50%'><div id='showimg'></div></td></tr>";
		content+="<tr><td>商品名称："+name+" </td><td>商品单价："+price+" </td></tr>";
		content+="<tr><td>商品类别："+type+"</td><td>商品状态："+_state+"</td></tr>";
		if(foodclass=='3'){
			content+="<tr><td colspan=''>是否推荐/优惠："+_foodclass+"</td><td colspan=''>优惠价："+favPrice+"</td></tr>";
		}else{
			content+="<tr><td colspan='2'>是否推荐/优惠："+_foodclass+"</td></tr>";
		}
		content+="<tr><td colspan='2'>商品描述："+description+"</td></tr>";
		content+="</table>";
		new Dialog(content,{
						"width":"550px",
						"title":'商品详情',
						'modal':true,
						"closeModal":false
					});
			$("#showimg").html("<img src=${pageContext.request.contextPath }/images/food/"+pic+" />");
	};
	//加载商品类型
	$(document).ready(function(){
		var url="foodManager!getAllFoodType";
		$.post(url,function(data){
			var allFoodType=eval(data);
		    var select="<option value=''>全 部</option>";
			for(var i=0;i<allFoodType.length;i++){
				var foodtype=eval(allFoodType[i]);
				select+="<option value='"+foodtype[0]+"'>"+foodtype[1]+"</option>";
			}
			$("select[name='food.foodType.id']").html(select);
		});
	});

</script>
</head>
  <body>
  <%-- 加载左边菜单 --%>
  <s:include value="../main/left.jsp?mid=m22"></s:include>
  
  <div class="clear"></div>
  <div id="main-content">
  
   <!-- Box Content -->
   <div class="content-box">
   
    <!-- Box Header -->
		<div class="content-box-header">
	    <h3>商品列表</h3>
	    <div class="clear"></div>
	    	
  	</div>
  	<!-- End Box header -->
    
  	<!-- Table Content -->
  	<div class="tab-content">
     <s:form action="foodManager!list" namespace="/admin" method="post">
  	<div class="tab-hand">
  	商品搜索：
  		商品类型：<select name="food.foodType.id">
  			<option>全 部</option>
  		</select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  		销售方式：<select name="food.foodClass">
  			<option value="">全 部</option>
  			<option  value="1">一 般</option>
  			<option  value="2">推 荐</option>
  			<option  value="3">优 惠</option>
  		</select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  		商品状态：<select name="food.state">
  			<option  value="">全 部</option>
  			<option  value="1">正 常</option>
  			<option  value="2">下 架</option>
  		</select>&nbsp;&nbsp;&nbsp;
  		<input type="submit" value=" 搜 索 "/>		
  	</div>
  	</s:form>
  		<table>
  			<thead>
  				<tr>
  			<th><input class="check-all" type="checkbox" /></th>
            <th>图片</th>
            <th>商品名称</th>
            <th>价格</th>
            <th>类型</th>
            <th>销售方式</th>
            <th>优惠价</th>
            <th>状态</th>
            <th>操作</th>
          </tr>
        </thead>
        <tfoot>
          <tr>
            <td colspan="6">
              <div class="bulk-actions align-left"><a class="button" href="#" onclick="delMoreFood(this,${pageObj.currPage})">删&nbsp;&nbsp;除</a></div>
              
              <div class="pagination">
              <s:form action="foodManager!list" namespace="/admin" id="frmPage">
              <s:textfield name="pageObj.currPage" size="1"/>/${pageObj.allPages }页，每页显示${pageObj.rows }行，共${pageObj.allRows }行
							<input type="submit" value="GO!"/>
							
							<a href="javascript:goPage('1')">&laquo; 首页</a>
							<s:if test="pageObj.hasPrePage">
							<a href="javascript:goPage('${pageObj.prePage }')">&laquo; 上一页</a>
							</s:if>
							<s:if test="pageObj.hasNextPage">
							<a href="javascript:goPage('${pageObj.nextPage }')">下一页 &raquo;</a>
							</s:if>
							<a href="javascript:goPage('${pageObj.allPages }')">尾页 &raquo;</a>
							</s:form>
              </div>
              <!-- End .pagination -->
              <div class="clear"></div>
            </td>
          </tr>
        </tfoot>
        <tbody>
        <s:iterator value="pageObj.results" var="temp">
	  		<tr>
	  		  <td><input type="checkbox" name="foodId" value="${temp.id }" /></td>
  			  <td>
  			  	<img height="50" width="100" src="${pageContext.request.contextPath }/images/food/${temp.pic}" alt="商品图片" />
  			  </td>
  			  <td>${temp.name }</td>
  			  <td>${temp.price }</td>
  			  <td>${temp.foodType.name }</td>
  			  <td >
					<s:if test="#temp.foodClass==1">
	  			  	<lable style="color:blue" align="center">一般</lable>
	  			  	</s:if>
	  			  	<s:elseif test="#temp.foodClass==2">
	  			  	<lable style="color:green">推荐</lable>
	  			  	</s:elseif>
	  			  	<s:else>
	  			  	<lable style="color:gray">优惠</lable>
	  			  	</s:else>
				</td>
				<td>${temp.favPrice }</td>
  			  <td>
  			  	<s:if test="#temp.state==1">
  			  	<lable style="color:blue">正常</lable>
  			  	</s:if>
  			  	<s:elseif test="#temp.state==2">
  			  	<lable style="color:green">下架</lable>
  			  	</s:elseif>
  			  	<s:else>
  			  	<lable style="color:gray">异常</lable>
  			  	</s:else>
  			  </td>
  			  <td>
						<a href="#" onclick="showUpdate('${temp.id }','${temp.name }','${temp.price }','${temp.foodType.id}','${temp.state }','${temp.description }','${temp.pic }','${temp.foodClass }','${temp.favPrice }')" title="编辑"><img src="${pageContext.request.contextPath }/admin/images/icons/pencil.png" alt="编辑" /></a> 
						<a href="#" title="删除" onclick="delOneFood(this,${pageObj.currPage},${temp.id })"><img src="${pageContext.request.contextPath }/admin/images/icons/cross.png" alt="删除" /></a> 
						<a href="#" title="详细信息" onclick="shouDetial('${temp.name }','${temp.price }','${temp.foodType.name}','${temp.state }','${temp.description }','${temp.pic }','${temp.favPrice }','${temp.foodClass }')"><img src="${pageContext.request.contextPath }/admin/images/search.gif" alt="详细" /></a>
					</td>
	  		</tr>
		  	</s:iterator>
        </tbody>
			</table>
     </div>
     <!-- End Table Content -->
     
   </div>
   
   <!-- End Box Content -->
   
  <div class="clear"></div>
  <%-- 加载底部 --%>
  <s:include value="../main/footer.jsp"></s:include>
  </div>
  </body>
</html>
